<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/hotel.css">
    <script src="../jquery/jquery-3.4.1.js"></script>
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css"/>
</head>
<body>
<div class="head" style="background-image: url(../img/bg_header_index_top.png); height: 50px">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>

                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">此处是logo</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav" style="margin-right: 2px">
                <li><a href="index.html">首页</a></li>
                <li><a href="allhotel.html">国内酒店</a></li>
                <li><a href="#">国外酒店</a></li>
                <li><a href="#">特卖专区</a></li>
                <li class="active"><a href="index.html">旗下品牌</a></li>
                <li><a href="#">华住会</a></li>
                <li><a href="#">华住商旅</a></li>
            </ul>

            <ul class="nav navbar-nav navbar-right">
                <li style="margin-right: 30px;margin-top: 10px">
                    <button type="button" class="btn btn-primary small " style=";height: 30px;width:70px">登录</button>
                </li>
                <li style="margin-right: 30px;margin-top: 10px">
                    <button type="button" class="btn btn-default small active" style=";height: 30px;width:70px">注册
                    </button>
                </li>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
</div>
<script>
    $.ajax({
        url:'http://localhost:8888/getuser',
        success:function(res){
            if(res.length>0){
                console.log(res[0].userName)
                $(".navbar-nav").eq(1).html("<li style=\"margin-right: 30px;margin-top: 10px\">\n" +
                    "                    <div style=\";height: 30px;width:70px;font-size: 14px;cursor: pointer\" title='点击进入个人中心' onclick='personcenter()'id='info'>"+res[0].userName+"</div>\n" +
                    "                </li>\n")
            }
            else {
                $(".navbar-nav").eq(1).html(" <li style=\"margin-right: 30px;margin-top: 10px\">\n" +
                    "                    <button type=\"button\" class=\"btn btn-primary small \" style=\";height: 30px;width:70px;\" onclick=\"loginSys()\" id='info'>登录</button>\n" +
                    "                </li>\n" +
                    "                <li style=\"margin-right: 30px;margin-top: 10px\">\n" +
                    "                    <button type=\"button\" class=\"btn btn-default small active\" style=\";height: 30px;width:70px\">注册\n" +
                    "                    </button>\n" +
                    "                </li>")
            }
        }
    })
    function personcenter() {
        $.ajax({
            url:"http://localhost:8888/recentHtmlPage",
            data:"htmlPage="+window.location.href,

            success:function (data) {
                alert("11")
            }
        })
        window.location.href="http://localhost:8080/user/getuserinfo"
    }
    function loginSys() {
        $.ajax({
            url:"http://localhost:8888/recentHtmlPage",
            data:"htmlPage="+window.location.href,

            success:function (data) {
                alert("11")
            }
        })
        // alert(1)

        window.location.href="http://localhost:8080/login"

    }

</script>
<div style="margin-left:5%;width:90%;height: 60px;padding-top: 20px;border-bottom: 1px solid #eeeae9;
">
    <tr class="navigation" style="color: #666666;font-size: small">
        <a href="index.html" style="text-decoration: none;">
            <td><span style="font-size:small;color: #666666">首页</span>&nbsp;&nbsp;&nbsp;&nbsp;></td>
        </a>
        <a href="index.html" style="text-decoration: none;">
            <td>&nbsp;<span style="font-size:small;color: #666666">&nbsp;&nbsp;&nbsp;酒店&nbsp;&nbsp;&nbsp;&nbsp;></span>
            </td>
        </a>
        <td>&nbsp;&nbsp;&nbsp;&nbsp;<span style="font-size:small;color: #666666" id="hotelname">上海美爵大酒店</span></td>
    </tr>
</div>
<div style="margin-left: 5%;margin-top: 10px;float: left;width: 50%">
    <div style="color: #7F1F59;font-size: 16px;" id="hotelenglishName">
    </div>
    <div style="color: #7F1F59;font-size: 18px;" id="showHotelName">上海证大美爵酒店</div>
    <div style="margin-top: 5px;font-size: 14px;" id="locate">迎春路1199号, 上海, 中国</div>
</div>
<div style="float: right;margin-right: 5%;width: 18%;margin-top: 15px;height: 60px;border: 1px solid #eeeae9;">
    <img alt="Author:zcj" style="width: 100%" id="brandlogo">
</div>
<div style="float: right;width: 10%;margin-top: 57px;margin-right: 1%;cursor: pointer;" id="collect"
     onclick="collect()">
    <img src="../img/未收藏.png" width="18%" style="float: right" id="img">
    <span style="float: right;" id="tip">
        收藏&nbsp;&nbsp;
    </span>
</div>
<div style="width: 71.5%;margin-left:5%;height: 500px;margin-top: 10px;float: left;" class="img">
    <div style="width: 83%;height:500px;float:left" id="bigimg"><img src="" alt="Author:zcj" height="500px"
                                                                     width="100%"></div>
    <div style="float: right;width: 16.5%;height: 121px;border: 3px #AE1A63 solid"><img alt="Author:zcj" height="100%"
                                                                                        width="100%" id="shoimg1">
    </div>
    <div style="float: right;width: 16.5%;height: 121px;margin-top: 5px"><img alt="Author:zcj" height="100%"
                                                                              width="100%" id="shoimg2"></div>
    <div style="float: right;width: 16.5%;height: 121px;margin-top: 5px"><img alt="Author:zcj" height="100%"
                                                                              width="100%" id="shoimg3"></div>
    <div style="float: right;width: 16.5%;height: 121px;margin-top: 6px"><img alt="Author:zcj" height="100%"
                                                                              width="100%" id="shoimg4"></div>
</div>
<div style="float: right;width: 17.8%;height: 500px;margin-top: 10px;margin-right: 5.1%;border: 1px solid #eeeae9;">
    <div style="margin-top: 30px;float: right;margin-right: 10%;">酒店综合评分</div>
    <!--    <div style="margin-top: 60px;margin-left: 76%;font-size: 12px">-->
    <div style="float:right;width: 40%;margin-top: 78px;height: 22px;margin-right: -28px" id="score">
        <!--            <img src="../img/五角星%20全星.png" alt="" width="16%">-->
        <!--            <img src="../img/五角星%20全星.png" alt="" width="16%">-->
        <!--            <img src="../img/五角星%20全星.png" alt="" width="16%">-->
        <!--            <img src="../img/五角星%20半星.png" alt="" width="16%">-->
        <!--            <img src="../img/五角星.png" alt="" width="16%">-->
    </div>
    <div style="float: right;margin-right: 10%;width: 25%;margin-top:-33px"><span style="color: #632D4F;font-size: 24px"
                                                                                  id="hotelscore">5
        </span>/5分
    </div>
    <div style="font-size: 13px;margin-top: 107px;width: 50%;margin-left: 50%">一共<span id="commentcount">121</span>条评论
    </div>
    <div style="margin-top: 10px;margin-left: 38%;margin-right: 33%;width: 24%">最近评论</div>
    <div style="margin-top: 5px;height: 170px;padding-top: 10px;padding-left: 10px;padding-right: 10px;border-top: 1px solid #eeeae9;font-size: 14px"
         id="recentcomment1">
        <!--        答复范德萨fasdfsfsafsdfsfdddddddd分数飞速发是飞速发是否是分数发是否ssssssssssssss是发萨芬是发是分数发是发阿萨-->
        <div style="margin-top: 20px;font-size: 12px;float: right;">评论来自用户:<span id="username1" style="color:#AE1A63;">高轩沙雕</span>
        </div>
        <div style="margin-top: 20px;width: 55%;margin-left: 50%">于<span id="commentdate1">2020年5月13日</span></div>
    </div>
    <div style="height: 168px;padding-top: 10px;padding-left: 10px;padding-right: 10px;border-top: 1px solid #eeeae9;font-size: 14px"
         id="recentcomment2">
        <!--        答复范德萨fasdfsfsafsdfsfdddddddd分数飞速发是飞速发是否是分数发是否ssssssssssssss是发萨芬是发是分数发是发阿萨-->
        <div style="margin-top: 20px;font-size: 12px;float: right;">评论来自用户:<span id="username2" style="color:#AE1A63;">高轩沙雕</span>
        </div>
        <div style="margin-top: 20px;width: 55%;margin-left: 50%">于<span id="commentdate2">2020年5月13日</span></div>
    </div>
</div>
<div style="margin-left: 5%;margin-top: 620px;height: 50px;margin-right: 5%" id="select">
    <div class="anchor_point" style="border-left: 1px solid #eeeae9" onclick="getAnchor()">酒店预订</div>
    <div class="anchor_point" onclick="getTrances()">交通位置</div>
    <div class="anchor_point" onclick="getHotelInfo()">酒店介绍</div>
    <div class="anchor_point" onclick="getService()">服务设施</div>
    <div class="anchor_point" onclick="getPolicy()">酒店政策</div>
    <div class="anchor_point" style="width: 15%" onclick="getComment()">酒店点评</div>
</div>
<div style="height: 800px;width: 90%;margin-right: 5%;margin-left: 5%;border:  1px solid #eeeae9;border-top: none"
     id="orderhotel">
    <div>酒店预订</div>
    <div id="order">
        lll
    </div>
</div>
<script>
    // $("#order").load("http://localhost:8080/room.html")
</script>
<div style="height: 458px;width: 60%;margin-right: 5%;margin-left: 5%;border:  1px solid #eeeae9;margin-top: 15px;float: left"
     id="trance">
    <!--    <div style="margin-left: 5%"><h3><img src="../img/position.png" width="3%">&nbsp;交通位置</h3></div>-->
    <!--    <iframe src="../tool/map.html?add=迎春路1199号, 上海, 中国" width="100%" height="500"-->
    <!--            frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes" id="showlocate">-->
    <!--    </iframe>-->
</div>
<div style="float: right;width: 29%;margin-right: 5%;height: 100%;margin-top: -458px;border:  1px solid #eeeae9"
     id="near">
    <div style="margin-top: 10px;font-size: 30px;margin-left: 34%;">附近酒店</div>


</div>
<div class="hotel_conment" id="hotelinfo">
    <div style="width:90%;margin: 10px auto;font-size: 20px;margin-left: 4%;border-bottom: 1px solid #eeeae9;"><h3><img
            src="../img/评%20论%20.png" width="2%">&nbsp;酒店介绍</h3></div>
    <div style="margin-top: 10px;padding-left: 4%;padding-right: 4%;font-size: 12px;line-height: 1.6"
         id="hotelintroduce">
        介绍介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容介绍内容内容
    </div>
</div>
<div class="hotel_conment" style="margin-top: 20px;" id="service">
    <div style="width:90%;margin: 10px auto;font-size: 20px;margin-left: 4%;border-bottom: 1px solid #eeeae9"><h3><img
            src="../img/设施.png" width="2%">&nbsp;酒店设施</h3></div>
    <div class="facilities_name">基本设施</div>
    <div class="facilities">
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
    </div>
    <div class="facilities_name">服务设施</div>
    <div class="facilities">
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>

    </div>
    <div class="facilities_name">房间设施</div>
    <div class="facilities">
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>

    </div>
    <div class="facilities_name">餐饮设施</div>
    <div class="facilities">
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>

    </div>
    <div class="facilities_name">娱乐设施</div>
    <div class="facilities">
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>
        <div>邮递</div>

    </div>
</div>
<div class="hotel_conment" style="margin-top: 10px;height: 100%" id="policy">
    <div style="width:90%;margin: 10px auto;font-size: 20px;margin-left: 4%;border-bottom: 1px solid #eeeae9;"><h3><img
            src="../img/评%20论%20.png" width="2%">&nbsp;酒店政策</h3></div>
    <div style="margin-top: 10px;padding-left: 4%;padding-right: 4%">
        <div style="width: 100%;background-color: red;height: 80px">
            <div style="float: left;width: 18%;background-color:bisque;height: 80px;line-height: 80px;padding-left: 2%">
                入住
            </div>
            <div style="width: 100%;background-color: #1b6d85;height: 80px">每天24小时</div>
        </div>
        <div style="width: 100%;background-color: red;height: 80px">
            <div style="float: left;width: 18%;background-color:bisque;height: 80px;line-height: 80px;padding-left: 2%">
                入住
            </div>
            <div style="width: 100%;background-color: #1b6d85;height: 80px;line-height: 80px">每天24小时</div>
        </div>
        <div style="width: 100%;background-color: red;height: 80px">
            <div style="float: left;width: 18%;background-color:bisque;height: 80px;line-height: 80px;padding-left: 2%">
                入住
            </div>
            <div style="width: 100%;background-color: #1b6d85;height: 80px">每天24小时</div>
        </div>
    </div>
</div>

<div>
    <div class="hotel_conment" style="margin-top: 10px;">
        <div style="width:90%;margin: 10px auto;font-size: 20px;margin-left: 4%;border-bottom: 1px solid #eeeae9;"><h3>
            <img
                    src="../img/评%20论%20.png" width="2%">&nbsp;酒点点评</h3></div>
        <div id="comment">
            <!--        <div class="hotel_comment">酒店评论酒店评论酒店评论酒店评论-->
            <!--            酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论-->
            <!--            酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论-->
            <!--            <div style="margin-left:70%">来自<span>user2002年5月14日</span>的评价</div>-->
            <!--        </div>-->
            <!--        <div class="hotel_comment">酒店评论酒店评论酒店评论酒店评论-->
            <!--            酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论-->
            <!--            酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论酒店评论-->
            <!--            <div style="margin-left:70%">来自<span>user2002年5月14日</span>的评价</div>-->
            <!--        </div>-->
        </div>
        <div style="margin-top: 15px;width: 90%;margin-left: 4%;padding-bottom: 40px;">


            <textarea class="form-control" rows="3" placeholder="我也要评论"></textarea>
            <button style="margin-left: 90%;margin-top: 10px" onclick="commitComment()">提交评论</button>
            <button type="button" class="btn btn-info" value="5" style="margin-bottom: 10px" id="t1">3分（默认）</button>
            您的评分
        </div>
        <div style="width: 90%;margin-left: 5%;">
            <nav aria-label="Page navigation" style="text-align: center">
                <ul class="pagination pagination-lg">
                    <li>
                        <a href="#" aria-label="Previous">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                    <li class="active"><a href="###">1</a></li>
                    <li><a href="###">2</a></li>
                    <li><a href="###">3</a></li>
                    <li><a href="###">4</a></li>
                    <li><a href="###">5</a></li>
                    <li>
                        <a href="#" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
    </div>
    <div style="float: left;background-color: greenyellow;margin-top: 10px;margin-left: 10px;width: 30%;height: 200px">
        <div style="text-align: center;font-size: 20px;margin-top:5px">酒店评分</div>
        <div id="commitscore">
            <button type="button" class="btn btn-danger" value="1">很不满意（1分）</button>
            <button type="button" class="btn btn-warning" value="2">不满意（2分）</button>
            <button type="button" class="btn btn-info" value="3">一般（3分）</button>
            <button type="button" class="btn btn-primary" value="4">满意（4分）</button>
            <button type="button" class="btn btn-success" value="5">非常满意（5分）</button>
        </div>

    </div>
</div>
</body>
</html>
<script src="../js/hoteljs/hoteljs.js"></script>
<script>
    // var flag = true;
    // function test(){
    //     //页面一加载即执行,默认选中第一张图
    //     $("#shoimg1").css("border", "3px #AE1A63 solid");
    //     flag = false
    // }
    // if(flag) {
    //     test()//保证只执行一次
    // }
    $(".img>div").bind("click", function () {
        $(".img>div").each(function () {
            $(this).css("border", "")
        })
        if (this.id !== "bigimg") {
            $(this).css("border", "3px #AE1A63 solid");
        }
        var img = $(this).find("img").eq(0).attr("src")
        $("#bigimg").find("img").eq(0).attr("src", img)
    })
</script>
<script>

    function getAnchor() {
        document.querySelector("#orderhotel").scrollIntoView({
            block: "start",
            behavior: "smooth"
        })
    }

    function getTrances() {
        document.querySelector("#trance").scrollIntoView({
            block: "start",
            behavior: "smooth"
        })
    }

    function getHotelInfo() {
        document.querySelector("#hotelinfo").scrollIntoView({
            block: "start",
            behavior: "smooth"
        })
    }

    function getService() {
        document.querySelector("#service").scrollIntoView({
            block: "start",
            behavior: "smooth"
        })
    }

    function getPolicy() {
        document.querySelector("#policy").scrollIntoView({
            block: "start",
            behavior: "smooth"
        })
    }

    function getComment() {
        document.querySelector("#comment").scrollIntoView({
            block: "start",
            behavior: "smooth"
        })
    }
</script>
<script>
    //获取 上一个搜索页面传来的参数
    var searchUrl = window.location.href;
    var searchData = searchUrl.split("=");        //截取 url中的“=”,获得“=”后面的参数
    var hotelName = decodeURI(searchData[1]);   //decodeURI解码
    var id;
    var pagenum = 1;
    $("title").text(hotelName)

    $.ajax({
        url: "http://localhost:8888/hotelinfo?hotelName=" + hotelName + "&pageNum=" + pagenum,
        contentType: "application/x-www-form-urlencoded; charset=utf-8",
        success: function (data) {
            console.log(data)
            id = data[0][0].id
            $("#hotelenglishName").text(data[0][0].hotelEnglishName)
            $("#hotelname").text(data[0][0].hotelName);
            $("#showHotelName").html(data[0][0].hotelName)
            $("#locate").html(data[0][0].hotelLocate);
            $("#hotelintroduce").html(data[0][0].hotelContent);
            $("#score").html(score(data[0][0].hotelScore));
            $("#hotelscore").text(data[0][0].hotelScore);
            $("#brandlogo").attr("src", data[0][0].other1);
            $("#shoimg1").attr("src", data[0][0].hotelImg)
            $("#shoimg2").attr("src", data[0][1].hotelImg)
            $("#shoimg3").attr("src", data[0][2].hotelImg)
            $("#shoimg4").attr("src", data[0][3].hotelImg)
            $("#bigimg>img").attr("src", data[0][0].hotelImg)
            $("#policy").html(showPolicy(data))
            $("#service").html(facility((data[2])));
            $("#commentcount").text(data[6])
            console.log(pageNum(data[6]))
            if (data[6] == 0) {
                $(".pagination").text("暂时还没有评论哦")

            } else {
                $(".pagination").html(pageNum(data[6]))
            }
            if (data[4]) {
                $("#username1").text(data[4][1].uerId);
                $("#username2").text(data[4][0].uerId);
                $("#recentcomment1").text(data[4][1].comment)
                $("#recentcomment2").text(data[4][0].comment)
                $("#commentdate1").text(data[4][1].commentDate)
                $("#commentdate2").text(data[4][0].commentDate)
            }
            var html = "<div style=\"margin-top: 10px;font-size: 30px;margin-left: 34%;\">附近酒店</div>\n";
            for (var i = 0; i < data[5].length; i++) {
                html = html + "<div class=\"near_hotel\" onclick='showinfo(this)'>\n" + data[5][i].hotelName + "</div>"
            }
            $("#near").html(html)
            showlocate(data[0][0].hotelLocate)

                    var html = "";
                    for (var i = data[3].length - 1; i >= 0; i--) {
                        if (data[3][i].goodComment) {
                            html = html + "<div style=\"width: 92.5%;margin-left: 5%\">\n" +
                                "    <div style=\"float: left;width: 15%;border-right: 1px solid\"><img src=\"../img/userphoto_54x54.12cb9a47.png\" alt=\"\">\n" +
                                "        <div>" + data[3][i].uerId + "</div>\n" +
                                "        <div>vip等级</div>\n" +
                                "    </div>\n" +
                                "    <div style=\"width: 80%;float: left;margin-left: 1%;height: 95px;border: 1px lightgrey dashed\">\n" +
                                "\n" +
                                "        <div style=\"float: right;background-color: #F88E2F;color: white\"> 优质点评</div>\n" +
                                "        <div style=\"margin-top: 20px;margin-left: 5%;font-size: 14px;margin-right: 5%\">" + data[3][i].comment +
                                " </div>\n" +
                                "        <div style=\"margin-top: 35px;height: 20px;background-color: yellow;float: right;\">" + data[3][i].commentDate + "</div>\n" +
                                "    </div>\n" +
                                "</div>"
                        }
                    }
                    for (var i = data[3].length - 1; i >= 0; i--) {
                        console.log()
                        if (!data[3][i].goodComment) {
                            html = html + "<div style=\"width: 92.5%;margin-left: 5%\">\n" +
                                "    <div style=\"float: left;width: 15%;border-right: 1px solid\"><img src=\"../img/userphoto_54x54.12cb9a47.png\" alt=\"\">\n" +
                                "        <div>" + data[3][i].uerId + "</div>\n" +
                                "        <div>vip等级</div>\n" +
                                "    </div>\n" +
                                "    <div style=\"width: 80%;float: left;margin-left: 1%;height: 95px;border: 1px lightgrey dashed\">\n" +
                                "\n" +
                                "        <div style=\"margin-top: 20px;margin-left: 5%;font-size: 14px;margin-right: 5%\">" + data[3][i].comment +
                                " </div>\n" +
                                "        <div style=\"margin-top: 35px;height: 20px;background-color: yellow;float: right;\">" + data[3][i].commentDate + "</div>\n" +
                                "    </div>\n" +
                                "</div>"
                        }
                    }
            $("#comment").html(html)
        }
    })

    //将酒店评分转换为星星
    function score(number) {
        var flag = 0;
        var fullStar = "<img src=\"../img/五角星%20全星.png\" alt=\"\" width=\"16%\">";
        var halfStar = "<img src=\"../img/五角星%20半星.png\" alt=\"\" width=\"16%\">";
        var star = "<img src=\"../img/五角星.png\" alt=\"\" width=\"16%\">";
        var starHtml = "";
        for (var i = 0; i < Math.floor(number); i++) {
            console.log("一颗漫心")
            starHtml = starHtml + fullStar;
            flag = flag + 1
        }
        if (number % 1 != 0) {
            console.log("一颗半星")
            starHtml = starHtml + halfStar;

            flag = flag + 1
        }
        for (flag; flag < 5; flag++) {
            console.log("一颗空心")
            starHtml = starHtml + star;
        }
        return starHtml;
    }

    function showlocate(location) {
        var showlocate = "    <div style=\"margin-left: 5%\"><h3><img src=\"../img/position.png\" width=\"3%\">&nbsp;交通位置</h3></div>\n" +
            " <iframe src=\"../tool/map.html?add=" + location + "\" width=\"100%\" height=\"500\"\n" +
            "            frameborder=\"no\" border=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" allowtransparency=\"yes\">\n" +
            "    </iframe>";
        $("#trance").html(showlocate)
    }

    // showlocate("南京夫子庙")
    function showPolicy(policy) {
        var html = "  <div style=\"width:90%;margin: 10px auto;font-size: 20px;margin-left: 4%;border-bottom: 1px solid #eeeae9;\"><h3><img\n" +
            "            src=\"../img/评%20论%20.png\" width=\"2%\">&nbsp;酒店政策</h3></div>\n" +
            "    <div style=\"margin-top: 10px;padding-left: 4%;padding-right: 4%\">\n";
        for (var i = 0; i < policy[1].length; i++) {
            html = html + "<div style=\"width: 100%;height: 80px\">\n" +
                "            <div style=\"float: left;width: 18%;height: 80px;padding-top: 20px;padding-left: 2%;border-bottom: 1px solid #eeeae9\">" + policy[1][i].policyType +
                "            </div>\n" +
                "            <div style=\"width: 100%;height: 80px;line-height: 20px;border-bottom: 1px solid #eeeae9;padding-top: 20px\">" + policy[1][i].policyContent + "</div>\n" +
                "        </div>"
        }
        return html + "</div>";
    }

    // 传进来的是data[3]:
    // facilitiesName: "商务中心；220伏交流电；客房服务；健美中心；电梯；室外游泳池；高速网络；室内停车场；保险箱；24小时前台；行李员；婴儿看护"
    // facilitiesType: "基本设施"
    // 1: {facilitiesType: "安全设施", facilitiesName: "房间消防系统；应急照明；房间应急系统"}
    // 2: {facilitiesType: "商务设施", facilitiesName: "复印机；投影仪；电脑租赁"}
    function facility(facilities) {
        var html = "    <div style=\"width:90%;margin: 10px auto;font-size: 20px;margin-left: 4%;border-bottom: 1px solid #eeeae9\"><h3><img\n" +
            "            src=\"../img/设施.png\" width=\"2%\">&nbsp;酒店设施</h3></div>";
        for (var i = 0; i < facilities.length; i++) {
            var f = facilities[i].facilitiesName;
            var attr = f.split("；");
            var html = html + "<div class=\"facilities_name\">" + facilities[i].facilitiesType + "</div><div class=\"facilities\">\n ";
            for (var j = 0; j < attr.length; j++) {
                html = html + "<div>" + attr[j] + "</div>\n"
            }
            html = html + "</div>"
        }
        return html
    }

    $("#commitscore").find("button").click(function () {
        var s = $(this).val()
        var style = $(this).attr("class")
        $("#t1").text(s + "分")
        $("#t1").attr("class", style)
    })
    // 上面已经有了酒店id了
    var hotelScore = 3;//默认是三分
    $("#commitscore").find("button").click(function () {
        hotelScore = $(this).val()
    })

    function commitComment() {
        if($("#info").attr("title") !=="点击进入个人中心"){
            alert("请先登录")
            window.location.href="http://localhost:8080/login"
            return;
        }
        var comment = $("textarea").val()//获取用户评论的内容
        if (comment.length <= 0) {
            alert("你输入的评论太短了")
            return
        }
        var userid = 1;//默认是1号用户评论的
        var data = new Date().toLocaleDateString().toString();
        // alert(typeof data)
        //alert(typeof id)
        $.ajax({
            url: "http://localhost:8888/saveComment",
            data: "hotelId=" + id + "&uerId=" + userid + "&comment=" + comment + "&commentDate=" + data + "&hotelScore=" + hotelScore,
            success: function (data) {
                alert("评论成功")
                $("textarea").val("")
                window.location.reload();//刷新当前页面.

            }
        })
    }

    $(".pagination").find("li").click(function () {
        pagenum = $(this).text()
        // alert(pagenum)
        $.ajax({
            url: "http://localhost:8888/hotelinfo?hotelName=" + hotelName + "&pageNum=" + pagenum,
            contentType: "application/x-www-form-urlencoded; charset=utf-8",
            success: function (data) {
                var html = "";
                for (var i = data[3].length - 1; i >= 0; i--) {
                    if (data[3][i].goodComment) {
                        html = html + "<div style=\"width: 92.5%;margin-left: 5%\">\n" +
                            "    <div style=\"float: left;width: 15%;border-right: 1px solid\"><img src=\"../img/userphoto_54x54.12cb9a47.png\" alt=\"\">\n" +
                            "        <div>" + data[3][i].uerId + "</div>\n" +
                            "        <div>vip等级</div>\n" +
                            "    </div>\n" +
                            "    <div style=\"width: 80%;float: left;margin-left: 1%;height: 95px;border: 1px lightgrey dashed\">\n" +
                            "\n" +
                            "        <div style=\"float: right;background-color: #F88E2F;color: white\"> 优质点评</div>\n" +
                            "        <div style=\"margin-top: 20px;margin-left: 5%;font-size: 14px;margin-right: 5%\">" + data[3][i].comment +
                            " </div>\n" +
                            "        <div style=\"margin-top: 35px;height: 20px;background-color: yellow;float: right;\">" + data[3][i].commentDate + "</div>\n" +
                            "    </div>\n" +
                            "</div>"
                    }
                }
                for (var i = data[3].length - 1; i >= 0; i--) {
                    console.log()
                    if (!data[3][i].goodComment) {
                        html = html + "<div style=\"width: 92.5%;margin-left: 5%\">\n" +
                            "    <div style=\"float: left;width: 15%;border-right: 1px solid\"><img src=\"../img/userphoto_54x54.12cb9a47.png\" alt=\"\">\n" +
                            "        <div>" + data[3][i].uerId + "</div>\n" +
                            "        <div>vip等级</div>\n" +
                            "    </div>\n" +
                            "    <div style=\"width: 80%;float: left;margin-left: 1%;height: 95px;border: 1px lightgrey dashed\">\n" +
                            "\n" +
                            "        <div style=\"margin-top: 20px;margin-left: 5%;font-size: 14px;margin-right: 5%\">" + data[3][i].comment +
                            " </div>\n" +
                            "        <div style=\"margin-top: 35px;height: 20px;background-color: yellow;float: right;\">" + data[3][i].commentDate + "</div>\n" +
                            "    </div>\n" +
                            "</div>"
                    }
                }
                $("#comment").html(html)
            }
        })
    })

    function showinfo(obj) {
        var hotelName = $(obj).text()
        var searchUrl = encodeURI("../../html/hotel.html?hotelName=" + hotelName);   //使用encodeURI编码
        window.location.href = searchUrl;
    }
</script>

<script>
    //处理页数问题
    function pageNum(num) {
        var html = " <li>\n" +
            "                <a href=\"#\" aria-label=\"Previous\">\n" +
            "                    <span aria-hidden=\"true\">&laquo;</span>\n" +
            "                </a>\n" +
            "            </li>"
        if (num / 5 != 0 && num > 0) {
            for (var i = 0; i < num / 5; i++) {
                if (i == 0) {
                    html = html + "<li class=\"active\" onclick='page(this)'><a href=\"###\">" + (i + 1) + "</a></li>\n";
                } else {
                    html = html + "<li onclick='page(this)'><a href=\"###\">" + (i + 1) + "</a></li>"
                }
            }
            html = html + "            <li>\n" +
                "                <a href=\"#\" aria-label=\"Next\">\n" +
                "                    <span aria-hidden=\"true\">&raquo;</span>\n" +
                "                </a>\n" +
                "            </li>";
            // console.log(html)
        }
        return html;
    }
</script>
<script>
    function page(obj) {
        $(".pagination>li").each(function () {
            $(this).attr("class", "")
        })
        $(obj).attr("class", "active")
        pagenum = $(obj).find("a").text()
        console.log(pagenum)
        $.ajax({
            url: "http://localhost:8888/hotelinfo?hotelName=" + hotelName + "&pageNum=" + pagenum,
            contentType: "application/x-www-form-urlencoded; charset=utf-8",
            success: function (data) {
                var html = "";
                for (var i = 0; i < data[3].length; i++) {
                    if (data[3][i].goodComment) {
                        html = html + "<div style=\"width: 92.5%;margin-left: 5%\">\n" +
                            "    <div style=\"float: left;width: 15%;border-right: 1px solid\"><img src=\"../img/userphoto_54x54.12cb9a47.png\" alt=\"\">\n" +
                            "        <div>" + data[3][i].uerId + "</div>\n" +
                            "        <div>vip等级</div>\n" +
                            "    </div>\n" +
                            "    <div style=\"width: 80%;float: left;margin-left: 1%;height: 95px;border: 1px lightgrey dashed\">\n" +
                            "\n" +
                            "        <div style=\"float: right;background-color: #F88E2F;color: white\"> 优质点评</div>\n" +
                            "        <div style=\"margin-top: 20px;margin-left: 5%;font-size: 14px;margin-right: 5%\">" + data[3][i].comment +
                            " </div>\n" +
                            "        <div style=\"margin-top: 35px;height: 20px;background-color: yellow;float: right;\">" + data[3][i].commentDate + "</div>\n" +
                            "    </div>\n" +
                            "</div>"
                    }
                }
                for (var i = 0; i < data[3].length; i++) {
                    if (!data[3][i].goodComment) {
                        html = html + "<div style=\"width: 92.5%;margin-left: 5%\">\n" +
                            "    <div style=\"float: left;width: 15%;border-right: 1px solid\"><img src=\"../img/userphoto_54x54.12cb9a47.png\" alt=\"\">\n" +
                            "        <div>" + data[3][i].uerId + "</div>\n" +
                            "        <div>vip等级</div>\n" +
                            "    </div>\n" +
                            "    <div style=\"width: 80%;float: left;margin-left: 1%;height: 95px;border: 1px lightgrey dashed\">\n" +
                            "\n" +
                            "        <div style=\"margin-top: 20px;margin-left: 5%;font-size: 14px;margin-right: 5%\">" + data[3][i].comment +
                            " </div>\n" +
                            "        <div style=\"margin-top: 35px;height: 20px;background-color: yellow;float: right;\">" + data[3][i].commentDate + "</div>\n" +
                            "    </div>\n" +
                            "</div>"
                    }
                }
                $("#comment").html(html)
            }
        })
    }


</script>

